
  /* Menu 

There are three areas of styling for the Menu:  
 
 1. The menu 
 	There are three types of menus:
 	i)Context Menu
 	ii)Drop down Menu
 	iii) Navigation Menu
 	All three types of menus are affected by the .dijitMenu class in which you can set the background-color, padding and border
 	.dijitMenu affects the drop down menu in TimeTextBox, Calendar, ComboBox and FilteringSelect
  .dijitMenuTable - for padding - also affects Select widget 	
  	
 2. The menu bar
 	.dijitMenuBar - for border, margins, padding, background-color of the menu bar
 	.dijitMenuBar .dijitMenuItem - for padding, text color of menu items in the menu bar (overrides .dijitMenuItem) 
 	
 3. Menu items - items in the menu.  
 	.dijitMenuItem - for color
 	.dijitMenuItemHover, .dijitMenuItemSelected - for background-color, border, text color, padding of a menu item or menubar item that has been hovered over or selected	
 	.dijitMenuItemActive - for bacgkround-color of an active (mousedown) menu item
	td.dijitMenuItemIconCell - for padding around a  menu item's icon
	td.dijitMenuItemLabel - for padding around a menu item's label	
	.dijitMenuSeparatorTop - for border, top border, of the separator
	.dijitMenuSeparatorBottom - for bottom margin of the separator
	
	Styles specific to ComboBox and FilteringSelect widgets: 
	.dijitComboBoxMenu .dijitMenuItem - for padding and border of a menu item in a ComboBox or FilteringSelect widget's menu
	.dijitComboBoxMenu .dijitMenuItemSelected- for text color, background-color and border of a menu item in a ComboBox or FilteringSelect widget's menu


*/
.claro .dijitMenuBar {
    border : 1px solid #b5bcc7;
    margin : 0px;
    padding : 0px;
    background-color : #e6e6e7;
    background-image : url("images/commonHighlight.png");
    background-position : 0px 0px;
    background-repeat : repeat-x;
}
.dj_ie6 .claro .dijitMenuBar {
    background-image : none;
}
.claro .dijitMenu {
    background-repeat : repeat-y;
    background-color : #fff;
    
  /*border: 1px solid #769dc0; support global widget change 
	*/
border-color : #769dc0;
    border-style : solid;
    border-width : 1px;
    
  /* so adjoining borders of MenuBar/ComboBox and Menu overlap, avoiding double border 
	*/
margin : -1px 0;
}
.claro .dijitMenuBar .dijitMenuItem {
    padding : 6px 10px 7px;
    background-position : 0px 100px;
    color : #4a4a4a;
    margin : -1px;
}
.claro .dijitMenuItem {
    background-image : url("images/menuHighlight.png");
    background-position : 0px -40px;
    background-repeat : repeat-x;
}

  /* this prevents jiggling upon hover of a menu item 
*/
.claro .dijitMenuTable {
    border-collapse : separate;
    border-spacing : 0 0;
    padding : 0px;
}
.claro .dijitMenuItem td {
    padding : 1px;
}

  /* hover over a MenuBarItem 
*/
.claro .dijitMenuPassive .dijitMenuItemHover, .claro .dijitMenuPassive .dijitMenuItemSelected {
    background-color : #abd6ff;
    
  /* border:solid 1px #769dc0; global widget color change support 
	*/
border-style : solid;
    border-width : 1px;
    border-color : #769dc0;
    background-position : 0px 0px;
    color : #000;
    padding : 5px 9px 6px;
}
.claro .dijitMenuPassive .dijitMenuItemActive {
    background-position : 0px -177px;
}
.dj_ie6 .claro .dijitMenuItem, .dj_ie6 .claro .dijitMenuPassive .dijitMenuItem {
    background-image : none;
}

  /* MenuBarItem that has been selected and menu drops down from it 
*/
.claro .dijitMenuActive .dijitMenuItemHover, .claro .dijitMenuActive .dijitMenuItemSelected {
    
  /* border:solid 1px #769dc0; global widget color change support 
	*/
border-style : solid;
    border-width : 1px;
    border-color : #769dc0;
    padding : 5px 9px 6px;
    background-color : #9dcfff;
    background-position : 0px 0px;
    color : #000;
}
.dj_ie .claro .dijitMenuActive .dijitMenuItemHover, .dj_ie .claro .dijitMenuActive .dijitMenuItemSelected, .dj_ie .claro .dijitMenuPassive .dijitMenuItemHover, .dj_ie .claro .dijitMenuPassive .dijitMenuItemSelected {
    padding-top : 6px;
    padding-bottom : 5px;
    margin-top : -3px;
}
.claro .dijitMenuActive .dijitMenuItemActive {
    background-color : #7dbefa;
    background-position : 0px -177px;
}
.claro .dijitMenuItemActive {
    background-position : 0px -177px;
}
.claro td.dijitMenuItemIconCell {
    padding : 2px;
    margin : 0px 0px 0px 4px;
}
.claro td.dijitMenuItemLabel {
    padding-top : 5px;
    padding-bottom : 5px;
}
.claro .dijitMenuExpand {
    width : 7px;
    height : 7px;
    background-image : url('images/spriteArrows.png');
    background-position : -14px 0px;
    margin-right : 3px;
}
.claro .dijitMenuItemDisabled .dijitMenuItemIconCell {
    opacity : 1;
}
.claro .dijitMenuSeparatorTop {
    height : auto;
    margin-top : 1px;
    
  /* prevents spacing above/below separator 
	*/
/* border-bottom: 1px solid #b5bcc7; global widget color change support 
	*/
border-bottom-width : 1px;
    border-bottom-style : solid;
    border-bottom-color : #b5bcc7;
}
.claro .dijitMenuSeparatorBottom {
    height : auto;
    margin-bottom : 1px;
}

  /* the checked menu item 
*/
.claro .dijitCheckedMenuItemIconChar {
    display : none;
}
.claro .dijitCheckedMenuItemIcon {
    background-image : url('form/images/checkboxRadioButtonStates.png');
    background-repeat : no-repeat;
    background-position : -15px 50%;
    width : 15px;
    height : 16px;
}
.dj_ie6 .claro .dijitCheckedMenuItemIcon {
    background-image : url('form/images/checkboxAndRadioButtons_IE6.png');
}
.claro .dijitCheckedMenuItemChecked .dijitCheckedMenuItemIcon {
    background-position : 0 50%;
}

  /*ComboBox Menu
*/
.claro .dijitComboBoxMenu {
    margin-left : 0px;
    background-image : none;
}
.claro .dijitComboBoxMenu .dijitMenuItem {
    padding : 2px 0px;
    text-indent : 6px;
    border-width : 1px 0px 1px 0px;
    border-style : solid;
    border-color : #fff;
}
.claro .dijitComboBoxMenu .dijitMenuItemSelected {
    color : #000;
    border-color : #768dc0;
    background-color : #abd6ff;
}
.claro .dijitComboBoxMenuActive .dijitMenuItemSelected {
    background-position : 0px -177px;
    background-color : #7dbefa;
}
.claro .dijitMenuPreviousButton, .claro .dijitMenuNextButton {
    font-style : italic;
}
